<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    <title>首页</title>
    <link rel="stylesheet" href="../../libs/node_modules/bootstrap/dist/css/bootstrap.min.css">
    <link rel="stylesheet" href="../../style/wap/index.css">
    <link rel="stylesheet" href="../../style/wap/replay.css">
    <script src="../../libs/jquery-3.2.1.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.3/umd/popper.min.js" integrity="sha384-ZMP7rVo3mIykV+2+9J3UJ46jBk0WLaUAdn689aCwoqbBJiSnjAK/l8WvCWPIPm49" crossorigin="anonymous"></script>
    <script src="../../libs/node_modules/bootstrap/dist/js/bootstrap.min.js"></script>
    <script src="../../libs/layer-v3.1.1/layer/layer.js"></script>
	<script src="../../libs/vue.js"></script>
	<script src="../../jsc/component_wap.js"></script>
	<script src="../../jsc/axios.min.js"></script>
	<script src="../../jsc/common.js"></script>
	<!--<script src="js/system.js"></script>-->
</head>
<body>
<div id="app" v-cloak>
	<header>
		<div class="tool-bar" style="height: 3rem;line-height: 3rem">
			{{ d.title | long(12) }}
		</div>
		<a class="pull-le" href="javascript:window.history.go(-1)" style="height: 3rem">
			<img src="../../static/icon-wap/左.png" alt="">
		</a>
	</header>

	<main style="margin-top: 0">
		<div class="content">
			<div class="problem-search-item">
				<div class="title-box">
					<div class="problem-search-item-title">{{ d.title }}</div>
					<div class="problem-search-item-prop">
						<span v-if="d.user">来源：{{ d.user.username }}</span>
					</div>
				</div>
				<div class="content-box">
					<div class="problem-search-item-option">
						<span>{{ d.createtime_text }}</span>
						<span>{{ d.reading }}次浏览</span>
					</div>
					<div class="problem-search-item-text" id="content">

					</div>
				</div>
				<div class="space"></div>
				<div class="comment-box">
					<div class="comment-title">评论</div>
					<div class="comment-input-box">
						<div class="comment-input">
							<textarea name="" id="" cols="30" rows="8" v-model="replycon"></textarea>
						</div>
						<div class="comment-btn" @click="tijiao()">
							发送
						</div>
					</div>

					<div class="comment-item" v-for="item in list">
						<div class="comment-info">
							<div class="info-headImg" >
							<!--<div class="info-headImg" style="background: url(../../static/icon-wap/头像01.png)no-repeat;background-size: contain">-->
								<img :src="item.user.avatar_text" alt="" style="object-fit:cover" width="100%" height="100%">
							</div>
							<div class="info-text">
								<div class="info-name">{{ item.user.nickname }}</div>
								<div class="info-time">{{ item.createtime }}</div>
							</div>
						</div>
						<div class="replay-content">
							<div class="replay-inner">
								{{ item.content }}
							</div>
						</div>
					</div>
				</div>
				<v-pagination v-if="total" :total="total" :display="limit" :currentPage="page" v-on:pagechange="togglePage"></v-pagination>
			</div>
		</div>
	</main>


</div>

<script>

    var userAgent = navigator.userAgent.toLowerCase();
    var platform;
    if(userAgent == null || userAgent == ''){
        platform = 'WEB' ;
    }else{
        if(userAgent.indexOf("android") != -1 ){
            platform = 'ANDROID';
//            location.href = "";
        }else if(userAgent.indexOf("ios") != -1 || userAgent.indexOf("iphone") != -1 || userAgent.indexOf("ipad") != -1){
            platform = 'IOS';
//            location.href = "";
        }else if(userAgent.indexOf("windows phone") != -1 ){
            platform = 'WP';
//            location.href = "";
        }else{
            platform = 'WEB' ;
            location.href = "../../views/problem/problem.html";
        }
    }


    function getScrollTop(){
        var scrollTop=0;
        if(document.documentElement&&document.documentElement.scrollTop){
            scrollTop=document.documentElement.scrollTop;
        }else if(document.body){
            scrollTop=document.body.scrollTop;
        }
        return scrollTop;
    }
    $(window).scroll(function () {
        if(getScrollTop()>=100){
            $(".suspension").show();
        }
        else{
            $(".suspension").hide();
        }
    });
    function to_top() {
        $(window).scrollTop(0);
    }
	var data = window.location.href.substring(window.location.href.indexOf("?") + 1).split("#")[0].split('&');          //传入数据
	var parameter = {};
	data.map(function( item , index ){parameter[ item.split("=")[ 0 ] ] = item.split("=")[ 1 ];});
new Vue({
	el:"#app",
	data:{
		d:'',
		list:[],
		page:1,
		total:1,
		limit:5,
		_id:'',
		replycon:'',
		siteid:''
	},
	filters:{
		long(str,num){
			if (str){
				return str.substring(0,num)
			}
		}
	},
	mounted(){
		var _id = parameter.id;
		if (_id){
			this.detail(_id);
			this.relist(_id,1);
			this._id = _id
		}

		// siteid
		if (localStorage.getItem('station')){
			this.siteid = JSON.parse(localStorage.getItem('station')).id
		} else{
			layer.msg('站点信息获取错误')
		}
	},
	methods:{
		detail(id){
			axios.post(sysurl+'asking/detail',{ asking_id:id }).then(res=>{
				if (res.data.code==1){
					this.d = res.data.data;
					let div = document.getElementById('content');
					div.innerHTML = res.data.data.postcontent
				} else{
					layer.msg(res.data.msg)
				}
			})
		},
		relist(id,page){
			axios.post(sysurl+'asking/back',{ asking_id:id,limit:this.limit,page:page }).then(res=>{
				if (res.data.code==1){
					this.list = res.data.data.data;
					this.total = res.data.data.total;
				} else{
					layer.msg(res.data.data.msg)
				}
			})
		},
		togglePage(e){
			this.relist(this._id,e)
		},
		tijiao(){
			let d = new FormData();
			d.append('user_id',)
			axios.post(sysurl+'asking/answered',{  })
		}
	}
})

</script>
</body>
</html>
